<template>
  <div class="contract">
    <x-header>联系信息
      <div href="javascript:;" class="headerAdd" @click="bindHeaderAdd">
        <img src="../../assets/img/securityCheckImg/addHeader.png" alt="">
      </div>
    </x-header>
    <div class="contractContent" v-for="(item, index) in dataList" :key="index" @click="ticketClick($event,item)">
      <div class="information-item">
        <div class="information-item-title">联系人/户主关系</div>
        <div class="information-item-answer">{{item.CONTACT_NAME}}/{{item.RELATION_NAME}}</div>
      </div>
      <div class="information-item">
        <div class="information-item-title">联系人类型</div>
        <div class="information-item-answer">{{item.CONTACT_TYPE_NAME}}</div>
      </div>
      <div class="information-item">
        <div class="information-item-title">联系电话</div>
        <div class="information-item-answer information-item-tel">{{item.CONT_CHANL_NO}}
        <img class="information-item-telIcon" src="../../assets/img/securityCheckImg/phone.png" @click.stop="callPhone($event, item.CONT_CHANL_NO)" alt="">
        </div>
      </div>
      <div class="information-item">
        <div class="information-item-title">证件类型</div>
        <div class="information-item-answer">{{item.CERT_TYPE_NAME}}</div>
      </div>
      <div class="information-item">
        <div class="information-item-title">证件号码</div>
        <div class="information-item-answer">{{item.CERT_NUM}}</div>
      </div>
    </div>
  </div>
</template>

<script>
import { XHeader } from "vux";
import Vue from "vue";
import { sqlQuery } from "@/utils/sqlOperation";
export default {
  data() {
    return {
      dataList: "",
      CONS_NO: "",
      CONTACT_TYPE_LIST: [], //联系人类型
      CERT_TYPE_LIST: [], //证件类型
      RELATION_LIST: [] //户主关系
    };
  },
  components: {
    XHeader
  },
  methods: {
    //打电话
    callPhone(e, phone){
      console.log(phone);
      AndroidApi.callPhone(phone);
    },
    bindHeaderAdd() {
      this.$router.push({
        path: "/contactMaintain?CONS_NO=" + this.CONS_NO
      });
    },
    ticketClick(event, item) {
      this.$router.push({
        path: "/contactMaintain?item=" + JSON.stringify(item) + "&change_type=2"
      });
    },
    callback(str, msg) {
      console.log(str, msg);
      const _this = this;
      switch (str) {
        case "change":
          const msgData = msg.map(function(item) {
            for (let i in _this.RELATION_LIST) {
              if (_this.RELATION_LIST[i].value == item.RELATION) {
                item.RELATION_NAME = _this.RELATION_LIST[i].name;
              }
            }
            for (let i in _this.CONTACT_TYPE_LIST) {
              if (_this.CONTACT_TYPE_LIST[i].value == item.CONTACT_TYPE) {
                item.CONTACT_TYPE_NAME = _this.CONTACT_TYPE_LIST[i].name;
              }
            }
            for (let i in _this.CERT_TYPE_LIST) {
              if (_this.CERT_TYPE_LIST[i].value == item.CERT_TYPE) {
                item.CERT_TYPE_NAME = _this.CERT_TYPE_LIST[i].name;
              }
            }
            return item;
          });
          Vue.set(this, "dataList", msgData);
          console.log(this.dataList);
          break;
        case "noChange":
          const msgDataChange = msg.map(function(item) {
            for (let i in _this.RELATION_LIST) {
              if (_this.RELATION_LIST[i].value == item.RELATION) {
                item.RELATION_NAME = _this.RELATION_LIST[i].name;
              }
            }
            for (let i in _this.CONTACT_TYPE_LIST) {
              if (_this.CONTACT_TYPE_LIST[i].value == item.CONTACT_TYPE) {
                item.CONTACT_TYPE_NAME = _this.CONTACT_TYPE_LIST[i].name;
              }
            }
            for (let i in _this.CERT_TYPE_LIST) {
              if (_this.CERT_TYPE_LIST[i].value == item.CERT_TYPE) {
                item.CERT_TYPE_NAME = _this.CERT_TYPE_LIST[i].name;
              }
            }
            return item;
          });
          Vue.set(this, "dataList", this.dataList.concat(msgDataChange));
          console.log(this.dataList);
          break;
        default:
          break;
      }
    }
  },
  mounted() {
    // //用户地址信息
    const _this = this;
    Vue.set(_this, "CONS_NO", localStorage.getItem("CONS_NO"));
    console.log(1234, _this.CONS_NO);
    // sqlQuery(this.CONS_NO, "CUST_CONTACTINFO", this.callback);
    // 户主关系
    AndroidApi.queryTableData(
      '{"whereClause":"select * from P_CODE where code_type= ?","whereArgs":["bpRelation"]}',
      function(msg) {
        if (msg.resultCode === "9999") {
          const RELATION_LIST = msg.result.map(item => {
            return {
              name: item.CODE_NAME,
              value: item.CODE_VALUE
            };
          });
          Vue.set(_this, "RELATION_LIST", RELATION_LIST);
        }
      }
    );
    // 联系人类型
    AndroidApi.queryTableData(
      '{"whereClause":"select * from P_CODE where code_type= ?","whereArgs":["bpContactMode"]}',
      function(msg) {
        if (msg.resultCode === "9999") {
          const CONTACT_TYPE_LIST = msg.result.map(item => {
            return {
              name: item.CODE_NAME,
              value: item.CODE_VALUE
            };
          });
          Vue.set(_this, "CONTACT_TYPE_LIST", CONTACT_TYPE_LIST);
        }
      }
    );
    // 证件类型
    AndroidApi.queryTableData(
      '{"whereClause":"select * from P_CODE where code_type= ?","whereArgs":["cdReCertType"]}',
      function(msg) {
        if (msg.resultCode === "9999") {
          const CERT_TYPE_LIST = msg.result.map(item => {
            return {
              name: item.CODE_NAME,
              value: item.CODE_VALUE
            };
          });
          Vue.set(_this, "CERT_TYPE_LIST", CERT_TYPE_LIST);
        }
      }
    );
    AndroidApi.queryTableData(
      JSON.stringify({
        whereClause:
          "SELECT * FROM CUST_CONTACTINFO_CHANGE A ,CONT_CHANL_CHANGE B WHERE A.M_CID = B.M_CID AND A.CONS_NO = ?",
        whereArgs: [_this.CONS_NO]
      }),
      function(msg) {
        console.log("联系信息CHANGE", msg.result);
        _this.callback("change", msg.result);
      }
    );
    AndroidApi.queryTableData(
      JSON.stringify({
        whereClause:
          "SELECT * FROM CUST_CONTACTINFO A ,CONT_CHANL B WHERE A.CONTACT_ID = B.CONTACT_ID AND A.CONS_NO = ?",
        whereArgs: [_this.CONS_NO]
      }),
      function(msg) {
        console.log("联系信息", msg);
        _this.callback("noChange", msg.result);
      }
    );
  }
};
</script>
<style scoped lang="less">
@import "../../assets/less/style.less";
</style>


